<template>
	<view class="all">
		<view class="header">
			<view class="title">
				登录人和团购
			</view>
			<view class="title2">
				微信登陆后自动注册
			</view>
		</view>
		<view class="logo">
			<image src="../../static/user/code.png" mode=""></image>
		</view>
		<view class="last" @click="login()">
			一键注册登录
		</view>
		<view class="bot">
			<label class="radio">
				<radio :checked="r1" @click="chose()" />
			</label>
			<view class="box">
				我已阅读并同意
				<text>《用户使用协议》</text>
				和
				<text>《隐私政策》</text>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				r1: false
			};
		},
		methods: {
			//login登录
			login() {
				uni.showLoading()
				const that = this
				uni.login({
					"provider": "weixin",
					"onlyAuthorize": true, // 微信登录仅请求授权认证
					success: function(res) {
						console.log(res);
						const code = res.code
						console.log(that);
						that.$api("/User/login", 'post', {
							code: code
						}).then((ret) => {
							console.log(ret);
							uni.hideLoading()
							if (ret.data.code == 1) {
								uni.setStorageSync('token', ret.data.data.token);
								uni.$u.toast("登录成功")
								setTimeout(() => {
									uni.switchTab({
										url: '/pages/index/index'
									})
								}, 1000)
							}
						}).catch((err) => {
							console.log(err);
						})
					},
				})
			},
			//登录底部单选
			chose() {
				this.r1 = !this.r1
				console.log(this.r1);
			},
		}
	}
</script>

<style lang="scss" scoped>
	.all {
		padding: 15px;

		.header {
			.title {
				font-size: 50rpx;
				font-weight: bold;
				color: #333333;
				margin: 10px 0;
			}

			.title2 {
				font-size: 28rpx;
				font-weight: 500;
				color: #333333;
			}
		}

		.logo {
			width: 100%;
			padding: 60px 0;
			display: flex;
			align-items: center;
			justify-content: center;

			image {
				width: 176px;
				height: 176px;
			}
		}

		.last {
			width: 90%;
			margin: 30px auto;
			text-align: center;
			padding: 10px 0;
			font-size: 30rpx;
			font-weight: bold;
			color: #FFFFFF;
			background: linear-gradient(#F9773A, #FF3B06);
			border-radius: 40px;
		}

		.bot {
			display: flex;
			align-items: center;
			justify-content: center;
			font-size: 26rpx;
			font-weight: 500;
			color: #333333;

			text {
				font-size: 26rpx;
				font-weight: 500;
				color: #FF3B06;
			}

		}
	}
</style>